import React from "react";
import { Alert, Table } from "antd";
import style from "./accountfrozen.module.scss";
import { useTranslation, Trans } from "react-i18next"; // 引入react-i18next

const data = [
  {
    currency: "CNY",
    balance: "22121.12",
    mechanism: "北京",
  },
];

export default function AccountFrozen() {
  const { t, i18n } = useTranslation(); // 结构拿出方法
  const columns = [
    {
      title: () => <>{t("form.balance")}</>,
      // title: "币种",
      dataIndex: "currency",
      key: "currency",
      align: "center",
    },
    {
      title: () => <>{t("form.balance")}</>,
      // title: "余额",
      dataIndex: "balance",
      key: "balance",
      align: "center",
    },
    {
      // title: "所在机构",
      title: () => <>{t("form.Affiliatedinstitution")}</>,
      key: " mechanism",
      dataIndex: "mechanism",
      align: "center",
    },
  ];
  return (
    <div className={style.AccountiDetailboss}>
      <div className={style.accountmineform}>
        <Alert
          style={{ textAlign: "left" }}
          message={t("buttons.explain")}
          // message="说明:"
          description={t("message.AlertMessage")}
          // description="资金冻结状态通常是由于您的资金正在向外付款或正在结汇，订单处理完成后即会解冻或扣减。"
          type="warning"
          showIcon
        />
      </div>
      <div className={style.accountdetailtable}>
        <Table
          columns={columns}
          size="middle"
          scroll={{
            x: 1000,
            // y: 400,
          }}
          pagination={{
            showSizeChanger: true,
            onChange: (page, pageSize) => {
              // console.log("page, pageSize", page, pageSize);
            },
            defaultPageSize: 8,
            showTitle: true,
            responsive: true,
          }}
          dataSource={data}
        />
      </div>
    </div>
  );
}
